<!-- 设置线索/来人目标 -->
<template>
  <dt-modal-edit
    ref="setClueOrVisitor"
    :title="title"
    @ok="ok"
    :label-width="100"
    :width="800"
    :showOk="!isCheck"
    :cancelText="isCheck ? '关闭' : '取消'">
    <div class="set-clue-or-visitor">
      <div class="target_mouth">
        <span>目标月份：</span>
        <span>{{ date }}</span>
      </div>
      <div class="tip-text">
        <Icon type="md-alert" :size="18" color="#FAAD14" style="line-height: 26px; margin-right: 10px" />
        <p v-if="setGoalType == 'SET'">
          1.请先完成案场目标设定，再根据案场目标拆分顾问目标。如果当前案场暂无目标，请点击“无需设定”；
          <br />
          <span style="color: #e9142e">
            2.注意：案场目标及顾问目标均需完成设定（包括设为“无需设定”），才视为完成目标设定任务，否则任务责任人将被扣分
          </span>
        </p>
        <p v-else>本月目标已锁定，您可对目标进行调整。系统将记录每次调整的差值</p>
      </div>
      <Tabs ref="setModalTabsRef" v-model="tabStatus" type="card" @on-click="onChangeTab" name="setModalTabs">
        <TabPane label="案场目标" name="case" tab="setModalTabs">
          <dt-grid ref="table" :onFetch="onFetch" :height="300"></dt-grid>
        </TabPane>
        <TabPane label="顾问目标" name="counselor" tab="setModalTabs">
          <clue-counselor ref="clueCounselor" />
        </TabPane>
      </Tabs>
    </div>
    <adjust-log ref="adjustLogRef" />
  </dt-modal-edit>
</template>

<script>
  import column from '../opt/ClueOrVisitorCase'
  import targetApi from '@/biz/buildingManagement/target'
  import clueCounselor from './clueCounselor'
  import adjustLog from '@/views/casemanagement/report/goalReach/components/adjustLog.vue'
  export default {
    components: {
      clueCounselor,
      adjustLog
    },
    data() {
      return {
        info: {},
        title: '',
        isCheck: true, //区分查看编辑
        settingId: '',
        modalType: '', //区分线索或来人
        setGoalType: '', //区分设定或调整
        date: '',
        tabStatus: 'case',
        caseCopy: {},
        caseTotal: null,
        changeFlag: true,
        counselorList: [], //顾问目标
        caseList: [] //案场目标
      }
    },
    methods: {
      create(data) {
        this.title = data.curState == 'CLUETARGET' ? '线索目标设定' : '来人目标设定'
        this.date = data.date
        this.modalType = data.curState
        this.setGoalType = data.setGoalType
        this.isCheck = data.isCheck
        this.settingId = data.settingId
        this.tabStatus = 'case'
        this.$refs.clueCounselor.importFlag = false
        this.init()
      },
      init() {
        this.$refs.setClueOrVisitor.show()
        this.$refs.table.init(this, new column(this))
        this.$refs.table.fetch()
      },
      onFetch() {
        let params = {
          settingId: this.settingId,
          type: targetApi.getTabsType(this.modalType)
        }
        return targetApi.getTargetAndAdvisorList(params, this.modalType).then((res) => {
          this.caseCopy = this.$tool.deepClone(res.case[0])
          this.caseTotal =
            this.setGoalType == 'SET' ? this.caseCopy.clueTarget : this.caseCopy.adjustmentTarget
          this.changeFlag =
            this.setGoalType == 'SET'
              ? String(this.caseCopy.clueTarget)
                ? true
                : false
              : String(this.caseCopy.adjustmentTarget)
              ? true
              : false
          this.caseList = res.case[0]
          this.counselorList = res.counselor
          this.getCounselorData()
          return res.case
        })
      },
      // 无需设定
      noSet(val) {
        val.clueTarget = '0'
        this.changeFlag = true
        this.caseTotal = '0'
        this.$refs.clueCounselor.caseTotal = this.caseTotal
      },
      //设定目标
      targetChange(val) {
        let reg = /^[0-9]\d*$/
        if (!reg.test(val)) {
          this.$Message.error('请输入正整数或选择“无需设定”')
          this.changeFlag = false
        } else {
          this.caseTotal = val
          this.changeFlag = true
          this.$refs.clueCounselor.caseTotal = this.caseTotal
        }
      },
      //调整目标
      adjustChange(val, row) {
        let reg = /^[0-9]\d*$/
        if (!reg.test(val)) {
          this.$Message.error('请输入正整数')
          this.changeFlag = false
        } else {
          row.diff = val - Number(row.clueTarget) //计算调整差
          this.$refs.table.loadList([{ ...row }])
          this.caseList = row
          this.caseTotal = val
          this.changeFlag = true
          this.$refs.clueCounselor.caseTotal = this.caseTotal
        }
      },
      onChangeTab(val) {
        //切换tab判断是否填写案场目标
        if (val == 'counselor' && !this.isCheck) {
          if (!this.changeFlag) {
            this.$Message.error('案场目标未设定，请先完成案场目标设定，再根据案场目标拆分顾问目标')
            this.tabStatus = 'case'
            return false
          }
        }
      },
      getCounselorData() {
        let data = {
          modalType: this.modalType,
          counselorList: this.counselorList,
          setGoalType: this.setGoalType,
          settingId: this.caseList.settingId,
          isCheck: this.isCheck,
          caseTotal: !this.caseTotal ? '0' : this.caseTotal
        }
        this.$refs.clueCounselor.init(data)
      },
      //保存提交
      ok(data) {
        console.log('zhk ~ file: setClueOrVisitor.vue:164 ~ ok ~ data:', data)
        let flag = this.$refs.clueCounselor.tipsFlag
        if (
          this.setGoalType == 'SET' &&
          (String(this.caseList.clueTarget) == 'null' || Number(this.caseList.clueTarget) < 0)
        ) {
          this.$Message.error('案场目标不能为空或负数')
          return false
        }
        if (
          this.setGoalType == 'ADJUST' &&
          (String(this.caseList.adjustmentTarget) == 'null' || Number(this.caseList.adjustmentTarget) < 0)
        ) {
          this.$Message.error('案场调整目标不能为空或负数')
          return false
        }
        if (!flag) {
          let params = {
            ...this.caseList,
            snapshotList: this.$refs.clueCounselor.list,
            type: targetApi.getTabsType(this.modalType)
          }
          targetApi.editClueTarget(params).then((res) => {
            this.$Message.success('设定成功')
            this.$emit('success')
            this.hide()
          })
        } else {
          this.$Message.error('顾问目标总和需大于或等于案场目标')
        }
      },
      hide() {
        this.$refs.setClueOrVisitor.hide()
      },
      //案场调整记录
      changeLog(row) {
        let data = {
          ...row,
          title: '案场目标调整记录',
          type: 'case',
          curState: this.modalType
        }
        this.$refs.adjustLogRef.show(data)
      }
    }
  }
</script>
<style lang="scss" scoped>
  .set-clue-or-visitor {
    .target_mouth {
      font-size: 14px;
      color: #333;
      font-weight: 600;
      margin-bottom: 10px;
    }
    .tip-text {
      display: flex;
      padding: 10px;
      background-color: rgba(254, 252, 236, 1);
      margin-bottom: 10px;
    }
  }
</style>
